<!doctype html>
<html>
    <head>
        <!-- 页面字符编码 -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <title></title>
        <link href="css/mui.min.css" rel="stylesheet" />
        <link href="css/comm.css" rel="stylesheet" />
        <link href="css/layout.css" rel="stylesheet" />
        <link href="css/iconfont.css" rel="stylesheet" />
    </head>
    <body>
        <!-- 头部 S-->
        <header class="mui-bar mui-bar-nav  mui-bar-bom mui-bar-white">
            <a class="iconfont icon-fanhui mui-pull-left"></a>
            <h1 class="mui-title mui-bar-title">我的订单</h1>
        </header>
        <!-- 头部 E -->
        <div class="mui-content">
            <div class="mui-scroll-wrapper mscrollSet mui-scroll-top">
                <div class="mui-scroll">
                    <div class="mui-my-orders">
                        <ul class="mui-mess-ul">
                            <li class="current">
                                <a href="javascript:;">全部</a>
                            </li>
                            <li>
                                <a href="javascript:;">待支付</a>
                            </li>
                            <li>
                                <a href="javascript:;">待消费</a>
                            </li>
                            <li>
                                <a href="javascript:;">待评价</a>
                            </li>
                        </ul>
                        <!--验证订单 S-->
                        <div class="mui-mess-content" style="display: block;">
                            <div class="mui-yz-order">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待消费</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                            <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn">
                                    <button>立即验证</button> </div>
                            </div>
                            <!--验证订单 E-->
                            <!--验证订单 S-->
                            <div class="mui-yz-order mt12">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待消费</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn">
                                    <button>立即验证</button> </div>
                            </div>
                            <!--验证订单 E-->
                        </div>
                        <div class="mui-mess-content">
                            <div class="mui-yz-order">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待支付</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time bm">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                            
                            </div>
                            <!--验证订单 E-->
                            <!--验证订单 S-->
                            <div class="mui-yz-order mt12">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待支付</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time bm">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                
                            </div>
                            <!--验证订单 E-->
                        </div>
                        <div class="mui-mess-content">
                            <div class="mui-yz-order">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待消费</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn">
                                    <button>立即验证</button> </div>
                            </div>
                            <!--验证订单 E-->
                            <!--验证订单 S-->
                            <div class="mui-yz-order mt12">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待消费</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn">
                                    <button>立即验证</button> </div>
                            </div>
                            <!--验证订单 E-->
                        </div>
                        <div class="mui-mess-content">
                            <div class="mui-yz-order">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待评价</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                            <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn bd">
                                    <button>查看评价</button> </div>
                            </div>
                            <!--验证订单 E-->
                            <!--验证订单 S-->
                            <div class="mui-yz-order mt12">
                                <div class="mui-yzorder-title">
                                    <dl>
                                        <dt>饭局编号：25342651561</dt>
                                        <dd>待评价</dd>
                                    </dl>
                                </div>
                                <div class="mui-yzorder-list">
                                    <img src="images/goods.png" />
                                    <div class="mui-media-body">
                                        <h2>雅致小包厢欢乐满堂红空 中花园</h2>
                                        <p>牛排：<i>200</i>g</p>
                                        <span>
                                    <i>￥</i>100.00 x 8
                                </span>
                                    </div>
                                </div>
                                <dl class="mui-order-time">
                                    <dt>地址：南城区</dt>
                                    <dd>开席时间：05-20  19:00</dd>
                                </dl>
                                <div class="mui-yzorder-btn bd">
                                    <button>查看评价</button> </div>
                            </div>
                            <!--验证订单 E-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src="js/mui.min.js"></script>
        <script type="text/javascript" src="js/jquery-2.1.0.js"></script>
        <script src="js/scroll-wrapper.js"></script>
        <script type="text/javascript">
            $(function() {
                window.onload = function() {
                    var $li = $('.mui-mess-ul li');
                    var $ul = $('.mui-mess-content');
                    $li.click(function() {
                        var $this = $(this);
                        var $t = $this.index();
                        $li.removeClass();
                        $this.addClass('current');
                        $ul.css('display', 'none');
                        $ul.eq($t).css('display', 'block');
                    })
                }
            });
        </script>
    </body>
</html>